<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<title>管理取派员</title>
<!-- 导入jquery核心类库 -->
<script type="text/javascript" src="../../js/jquery-1.8.3.js"></script>
<!-- 导入easyui类库 -->
<link rel="stylesheet" type="text/css"
	href="../../js/easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css"
	href="../../js/easyui/themes/icon.css">
<link rel="stylesheet" type="text/css"
	href="../../js/easyui/ext/portal.css">
<link rel="stylesheet" type="text/css" href="../../css/default.css">
<script type="text/javascript"
	src="../../js/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript"
	src="../../js/easyui/ext/jquery.portal.js"></script>
<script type="text/javascript"
	src="../../js/easyui/ext/jquery.cookie.js"></script>
<script src="../../js/easyui/locale/easyui-lang-zh_CN.js"
	type="text/javascript"></script>
<script type="text/javascript">
	$.fn.serializeJson = function() {
		var serializeObj = {};
		var array = this.serializeArray();
		var str = this.serialize();
		$(array).each(
				function() {
					if (serializeObj[this.name]) {
						if ($.isArray(serializeObj[this.name])) {
							serializeObj[this.name].push(this.value);
						} else {
							serializeObj[this.name] = [
									serializeObj[this.name], this.value ];
						}
					} else {
						serializeObj[this.name] = this.value;
					}
				});
		return serializeObj;
	};

	function doAdd() {
		$('#addWindow').window("open");
	}

	function doEdit() {
		// 获取页面中所有勾选快递员 id 
		var rows = $("#grid").datagrid('getSelections');
		if (rows.length != 1) {
			// 没有选中数据 
			$.messager.alert("警告", "必须选中且只能选中一条数据", "warning");
			return;
		}
		//校验后，打开更新界面，同时将选中的数据赋值
		$("#courierForm").form('load',rows[0]);
		//初始化下拉列表框的值(因为combobox下拉框 的初始值的设置要使用Easyui的语法，需单独初始化)
		$('#standardCombo').combobox('setValue', rows[0].standard.id);
		
		$('#addWindow').window("open");
	}

	function doDelete() {
		// 获取页面中所有勾选快递员 id 
		var rows = $("#grid").datagrid('getSelections');
		if (rows.length == 0) {
			// 没有选中数据 
			$.messager.alert("警告", "作废快递员必须选中一条以上数据", "warning");
		} else {
			// 选中数据 
			// 获取选中所有id ，拼接字符串方法 
			var array = new Array();
			for (var i = 0; i < rows.length; i++) {
				array.push(rows[i].id);
			}
			// 生成字符串
			var ids = array.join(",");
			// 将字符串发送服务器 
			window.location.href = "../../courier_delBatch.action?ids=" + ids;
		}
	}

	function doRestore() {
		alert("将取派员还原...");
	}
	//工具栏
	var toolbar = [ {
		id : 'button-add',
		text : '增加',
		iconCls : 'icon-add',
		handler : doAdd
	}, {
		id : 'button-edit',
		text : '修改',
		iconCls : 'icon-edit',
		handler : doEdit
	}, {
		id : 'button-delete',
		text : '作废',
		iconCls : 'icon-cancel',
		handler : doDelete
	}, {
		id : 'button-restore',
		text : '还原',
		iconCls : 'icon-save',
		handler : doRestore
	}, {
		id : 'button-search',
		text : '查询',
		iconCls : 'icon-search',
		handler : function() {
			// 显示查询窗口 
			$("#searchWindow").window('open');
		}
	} ];
	// 定义列
	var columns = [ [ {
		field : 'id',
		checkbox : true,
	}, {
		field : 'courierNum',
		title : '工号',
		width : 80,
		align : 'center'
	}, {
		field : 'name',
		title : '姓名',
		width : 80,
		align : 'center'
	}, {
		field : 'telephone',
		title : '手机号',
		width : 120,
		align : 'center'
	}, {
		field : 'checkPwd',
		title : '查台密码',
		width : 120,
		align : 'center'
	}, {
		field : 'pda',
		title : 'PDA号',
		width : 120,
		align : 'center'
	}, {
		field : 'standard.name',
		title : '取派标准',
		width : 120,
		align : 'center',
		formatter : function(data, row, index) {
			if (row.standard != null) {
				return row.standard.name;
			}
			return "";
		}
	}, {
		field : 'type',
		title : '取派员类型',
		width : 120,
		align : 'center'
	}, {
		field : 'company',
		title : '所属单位',
		width : 200,
		align : 'center'
	}, {
		field : 'deltag',
		title : '是否作废',
		width : 80,
		align : 'center',
		formatter : function(value, rowData, rowIndex) {
			// value 当前属性对应json数据中值 
			// rowData 当前行数据 
			// rowIndex 第几行 
			if (value == null) {
				return "正常使用";
			} else if (value == "1") {
				return "已经作废";
			}
		}
	}, {
		field : 'vehicleType',
		title : '车型',
		width : 100,
		align : 'center'
	}, {
		field : 'vehicleNum',
		title : '车牌号',
		width : 120,
		align : 'center'
	} ] ];

	$(function() {
		// 先将body隐藏，再显示，不会出现页面刷新效果
		$("body").css({
			visibility : "visible"
		});

		// 取派员信息表格
		$('#grid').datagrid({
			iconCls : 'icon-forward',
			fit : true,
			border : false,
			rownumbers : true,
			striped : true,
			pageList : [ 30, 50, 100 ],
			pagination : true,
			toolbar : toolbar,
			url : "../../courier_pageQuery.action",
			idField : 'id',
			columns : columns,
			onDblClickRow : doDblClickRow
		});

		// 添加取派员窗口
		$('#addWindow').window({
			title : '添加取派员',
			width : 800,
			modal : true,
			shadow : true,
			closed : true,
			height : 400,
			resizable : false
		});

		// 为快递员的保存按钮，设置点击事件
		$("#save").click(function() {
			// 判断form元素 是否满足 校验规则
			if ($("#courierForm").form('validate')) {
				$("#courierForm").submit();
			} else {
				$.messager.alert("警告", "表单中存在非法输入项！", "warning");
			}
		});

		// 查询按钮事件
		$("#searchBtn").click(function() {
			var params = $("#searchForm").serializeJson();
			// 将json对象 绑定datagrid上，完成带有条件 查询请求 
			$("#grid").datagrid('load', params);
			// 关闭查询窗口 
			$("#searchWindow").window('close');
		});
	});

	function doDblClickRow() {
		alert("双击表格数据...");
	}
</script>
</head>

<body class="easyui-layout" style="visibility: hidden;">
	<div region="center" border="false">
		<table id="grid"></table>
	</div>
	<div class="easyui-window" title="对收派员进行添加或者修改" id="addWindow"
		collapsible="false" minimizable="false" maximizable="false"
		style="top: 20px; left: 200px">
		<div region="north" style="height: 31px; overflow: hidden;"
			split="false" border="false">
			<div class="datagrid-toolbar">
				<a id="save" icon="icon-save" href="#" class="easyui-linkbutton"
					plain="true">保存</a>
			</div>
		</div>

		<div region="center" style="overflow: auto; padding: 5px;"
			border="false">
			<form id="courierForm" action="../../courier_save.action"
				method="post">
				<table class="table-edit" width="80%" align="center">
					<tr class="title">
						<td colspan="4">收派员信息</td>
					</tr>
					<!-- TODO 这里完善收派员添加 table -->
					<tr>
						<td>快递员工号</td>
						<td><input type="text" name="courierNum"
							class="easyui-validatebox" required="true" /></td>
						<td>姓名</td>
						<td><input type="text" name="name" class="easyui-validatebox"
							required="true" /></td>
					</tr>
					<tr>
						<td>手机</td>
						<td><input type="text" name="telephone"
							class="easyui-validatebox" required="true" /></td>
						<td>所属单位</td>
						<td><input type="text" name="company"
							class="easyui-validatebox" required="true" /></td>
					</tr>
					<tr>
						<td>查台密码</td>
						<td><input type="text" name="checkPwd"
							class="easyui-validatebox" required="true" /></td>
						<td>PDA号码</td>
						<td><input type="text" name="pda" class="easyui-validatebox"
							required="true" /></td>
					</tr>
					<tr>
						<td>快递员类型</td>
						<td><input type="text" name="type" class="easyui-validatebox"
							required="true" /></td>
						<td>取派标准</td>
						<td><input type="text" id="standardCombo" name="standard.id" value=""
							class="easyui-combobox"
							data-options="required:true,valueField:'id',textField:'name',
											url:'../../standard_findAll.action'" />
						</td>
					</tr>
					<tr>
						<td>车型</td>
						<td><input type="text" name="vehicleType"
							class="easyui-validatebox" required="true" /></td>
						<td>车牌号</td>
						<td><input type="text" name="vehicleNum"
							class="easyui-validatebox" required="true" /></td>
					</tr>
				</table>
			</form>
		</div>
	</div>

	<!-- 查询快递员-->
	<div class="easyui-window" title="查询快递员窗口" closed="true"
		id="searchWindow" collapsible="false" minimizable="false"
		maximizable="false" style="width: 400px; top: 40px; left: 200px">
		<div style="overflow: auto; padding: 5px;" border="false">
			<form id="searchForm">
				<table class="table-edit" width="80%" align="center">
					<tr class="title">
						<td colspan="2">查询条件</td>
					</tr>
					<tr>
						<td>工号</td>
						<td><input type="text" name="courierNum" /></td>
					</tr>
					<tr>
						<td>收派标准</td>
						<td><input type="text" name="standard.id"
							class="easyui-combobox"
							data-options="required:true,valueField:'id',textField:'name',
											url:'../../standard_findAll.action'" />
						</td>
					</tr>
					<tr>
						<td>所属单位</td>
						<td><input type="text" name="company" /></td>
					</tr>
					<tr>
						<td>类型</td>
						<td><input type="text" name="type" /></td>
					</tr>
					<tr>
						<td colspan="2"><a id="searchBtn" href="#"
							class="easyui-linkbutton" data-options="iconCls:'icon-search'">查询</a>
						</td>
					</tr>
				</table>
			</form>
		</div>
	</div>
</body>

</html>